import {Euler, EventDispatcher, Vector3, Spherical} from 'three';
import * as THREE from "three";

var Pano = function (camera, domElement) {
    function saveImage(fileName) {
        const image = new Image();
        const base64 = canvas.toDataURL("image/webp", .1);
        image.src = base64;
        const a = document.createElement('a');
        a.href = base64;
        a.download = fileName || '图片名字';
        a.click();
    }

    domElement.ownerDocument.onclick = () => {
        // return
        const deg = [
            {x: 90, y: 0, z: 0, fileName: 'O1_u'},
            {x: -90, y: 0, z: 0, fileName: 'O1_d'},
            {x: 0, y: -90, z: 0, fileName: 'O1_f'},
            {x: 0, y: 90, z: 0, fileName: 'O1_b'},
            {x: 0, y: 0, z: 0, fileName: 'O1_r'},
            {x: 0, y: 180, z: 0, fileName: 'O1_l'},
        ]
        let count = 0

        function fun(params) {
            euler.set(THREE.MathUtils.degToRad(params.x), THREE.MathUtils.degToRad(params.y), THREE.MathUtils.degToRad(params.z), 'XYZ')
            camera.quaternion.setFromEuler(euler);
            console.log(JSON.stringify(euler))
            setTimeout(() => {
                saveImage(deg[count].fileName)
                if (deg[++count]) fun(deg[count])
            }, 100)
        }

        fun(deg[0])
    };
}

Pano.prototype = Object.create(EventDispatcher.prototype);
Pano.prototype.constructor = Pano;

export {Pano};
